<include file="Public:header"/>
<load href="__PUBLIC__/webupload/webuploader.css" />
<load href="__PUBLIC__/webupload/style.css" />

<body data-tuktuk="boxes">
    <section>
        <article class="scroll">

        <div id="wrapper">
            <nav class="tabs text tiny" data-tuktuk="menu">
                <a href="#" data-tab="mylist" class="active">我的素材</a>
                <a href="#" data-tab="onlist">在线素材</a>
                <!-- <a href="#" data-tab="iconlist">图标素材</a> -->
                <!-- <a href="#" data-tab="startlist">启动画面素材</a> -->
            </nav>

            <div class="mylist tab" id="container">
                <div id="uploader">
                    <div class="queueList">
                        <ul class="filelist volist">
                            <volist name="volist" id="vo" >
                            <li ><p class="title">{$vo.filename}</p><p class="imgWrap"><img src="{$vo.url}"></p><p class="progress"><span></span></p><div class="file-panel vo">

                            <span file="{$vo.filename}" class="cancel remove">删除</span>                            
                            <span url="{$vo.url}" class="select" >选定</span>

                            </div>
                            </li>
                            </volist>
                        </ul>
                    </div>
                    <div class="statusBar" style="">
                        <div class="progress" style="display: none;">
                            <span class="text">0%</span>
                            <span class="percentage" style="width: 0%;"></span>
                        </div><div class="info">选中1张图片，共128.41K。</div>
                        <div class="btns">
                            <div id="filePicker2" class="webuploader-container"><div class="webuploader-pick">继续添加</div><div id="rt_rt_18t143q6rmve1s9sr5uaa11hnj6" style="position: absolute; top: 0px; left: 10px; width: 94px; height: 42px; overflow: hidden; bottom: auto; right: auto;"><input type="file" name="file" class="webuploader-element-invisible" multiple="multiple" accept="image/*"><label style="opacity: 0; width: 100%; height: 100%; display: block; cursor: pointer; background-color: rgb(255, 255, 255); background-position: initial initial; background-repeat: initial initial;"></label></div></div><div class="uploadBtn state-ready">开始上传</div>
                        </div>
                    </div>
                </div>
            </div>


            <div class="hide tab onlist" >
                <div id="uploader">
                    <div class="queueList">
                        <ul class="filelist volist">
                            <volist name="onlist" id="vo" >
                            <li ><p class="title">{$vo.filename}</p><p class="imgWrap"><img src="{$vo.url}"></p><p class="progress"><span></span></p><div class="file-panel vo">
                           
                            <span url="{$vo.url}" class="select" >选定</span>

                            </div>
                            </li>
                            </volist>
                        </ul>
                    </div>
                </div>
            </div>


        </div>




          <div style="display:none" id="wrapper">
            <div id="container">
                <div id="uploader">
                    <div class="queueList">
                        <div id="dndArea" class="placeholder">
                            <div id="filePicker"></div>
                            <p>或将照片拖到这里，单次最多可选10张,支持QQ截图</p>
                        </div>
                    </div>
                    <div class="statusBar" style="display:none;">
                        <div class="progress">
                            <span class="text">0%</span>
                            <span class="percentage"></span>
                        </div><div class="info"></div>
                        <div class="btns">
                            <div id="filePicker2"></div><div class="uploadBtn">开始上传</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>    
           
        </article>
    </section>
</body>
<load href="Public/fancyBox/jquery.fancybox.min.js" />
<load href="__PUBLIC__/webupload/webuploader.min.js" />
<load href="__PUBLIC__/webupload/upload.js" />


<script type="text/javascript">
$(function(){
    $('nav.tabs').find('a').on('click',function(e){
        e.preventDefault();
        var tab = $(this).data('tab');
        $('.tab').removeClass('show').addClass('hide');
        $('.tab.'+tab).removeClass('hide').addClass('show');
        $('.tab.'+tab).css('list-style','none');
        $('nav.tabs').find('a').removeClass('active');
        $(this).addClass('active');
    })
})    
</script>
</html>

